<!--
 * @Descripttion:试卷列表
 * @version:
 * @Author: ada.wu
 * @Date:2024-03-11 11:26:44
 * @LastEditors: ada.wu
 * @LastEditTime: 2024-04-08 15:01:56
-->
<template>
  <div>
    <van-pull-refresh v-model="listLoading" @refresh="downCallback">
      <van-list v-model:loading="listLoading" :finished="listFinished" @load="onLoadPage">
        <van-cell-group>
          <van-cell v-for="(item,index) in listData" :key="index" :title="item.examName" is-link @click="goExam(item)">
            <template #value>
              <!-- "status" 0-未开始，1-已阅读，2-进行中，3-已完成 -->
              <img v-if="item.status=='3'" src="/@/assets/employee/check.svg" class="v-m">
            </template>
          </van-cell>
        </van-cell-group>
        <template #finished>
          <van-divider v-if="listData.length">没有更多了</van-divider>
        </template>
      </van-list>
    </van-pull-refresh>
    <van-empty v-if="listData.length==0&&!listLoading" description="暂无查询结果…" :image="getAssets('empty.svg')" />
  </div>
</template>
<script lang="ts">
import { List, Toast, Dialog, Empty, PullRefresh, Divider } from "vant";
import { SuccessToast } from "/@/util/Message";
//util
import { onMounted, reactive, toRefs, ref, nextTick } from "vue";
import { useRoute, useRouter } from "vue-router";
import { PageEnum } from "/@/enums/pageEnum";
import { getNewObj } from "/@/util";
import { useStore } from "/@/store";

//api
import { examList } from "/@/api/ExamApi";
export default {
  name: "reservation",
  components: {
    [List.name]: List,
    [Empty.name]: Empty,
    [Divider.name]: Divider,
    [PullRefresh.name]: PullRefresh,
  },
  setup() {
    const store = useStore();
    const router = useRouter();
    const route = useRoute();
    let {
      activityId = "",
      valuatorUserId = "",
      evaluatedUserId = "",
    } = route.query;
    const state = reactive({
      isQuery: false,

      dateShow: false,
      dateTime: "" as any,
      dateTimeType: "",

      companyMap: <any>{},
      familyMemberName: "",
      queryParam: {
        activityId,
        valuatorUserId,
        evaluatedUserId,
        pageNumber: 1, //当前页
        pageSize: 10, //分页大小
      },
      totalElements: 0,
      listData: <any>[],
      listFinished: false,
      listLoading: false,
    });
    onMounted(() => {
      nextTick(() => {
        // moment().format("YYYY-MM-DD");
        // setTimeout(() => {
        //     downCallback();
        //   }, 1000);
      });
    });
    //加载时执行
    const onLoadPage = () => {
      queryList();
    };
    const handleReset = () => {
      downCallback();
    };

    const downCallback = () => {
      resetList();
      queryList();
    };

    const queryList = () => {
      // if (state.listLoading) return;
      // state.listLoading = true;
      let { queryParam } = getNewObj(state);
      examList({
        ...queryParam,
      })
        .then((res: any) => {
          if (res) {
            console.log("res===", res.list);
            state.listData = [...state.listData, ...res.list];
            if (res.list.length < state.queryParam.pageSize) {
              state.listFinished = true;
            } else {
              state.queryParam.pageNumber++;
            }
          } else {
            state.listData = [];
            state.listFinished = true;
          }
        })
        .catch(() => {
          state.listFinished = true;
        })
        .finally(() => {
          state.listLoading = false;
        });
    };

    const resetList = () => {
      state.isQuery = false;
      state.queryParam.pageNumber = 1;
      state.listData = [];
    };

    const goExam = (item: any) => {
      let urlParam = {
        ...route.query,
        ...item,
      };
      if (item.status == "3") {
        router.push({
          path: PageEnum.EXAM_DETAIL,
          query: urlParam,
        });
      } else {
        router.push({
          path: PageEnum.EXAM,
          query: urlParam,
        });
      }
    };

    const goPolicyDetail = (item: any) => {};

    return {
      ...toRefs(state),
      goExam,
      goPolicyDetail,
      downCallback,
      handleReset,
      onLoadPage,
    };
  },
};
</script>

<style lang="scss" scoped>
::v-deep(.van-cell) {
  align-items: center;
}
::v-deep(.van-cell__title) {
  flex: 6;
}
</style>
